﻿<UserControl x:Class="Gallery.MVVM.ViewBrokerActivationSample.ViewBrokerActivationSampleView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:apexMVVM="clr-namespace:Apex.MVVM;assembly=Apex"
             xmlns:apexControls="clr-namespace:Apex.Controls;assembly=Apex"
             xmlns:apexCommands="clr-namespace:Apex.Commands;assembly=Apex"
             xmlns:ViewBrokerActivationSample="clr-namespace:Gallery.MVVM.ViewBrokerActivationSample" mc:Ignorable="d" 
             d:DesignHeight="600" d:DesignWidth="800">
    
    <UserControl.DataContext>
        <ViewBrokerActivationSample:ViewBrokerActivationSampleViewModel />
    </UserControl.DataContext>

    <UserControl.Resources>
        <Style x:Key="MenuItemStyle" TargetType="TextBlock">
            <Setter Property="FontSize" Value="14" />
            <Setter Property="FontWeight" Value="Light" />
            <Setter Property="Margin" Value="5,0,10,0" />
            <Setter Property="Foreground" Value="#898989" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsSelected}" Value="True">
                    <Setter Property="Foreground" Value="Black" />
                    <Setter Property="FontWeight" Value="ExtraBold" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>

    <Grid Style="{StaticResource GalleryItemStyle}">

        <apexControls:PaddedGrid Rows="Auto,Auto,*,Auto" Padding="4">

            <!-- Title section. -->
            <TextBlock Grid.Row="0" Style="{StaticResource Heading1}">VIEWBROKER ACTIVATION</TextBlock>
            <TextBlock Grid.Row="1" Style="{StaticResource Subtitle}">
            This sample demonstrates how Commands can be used.
            </TextBlock>

            <!-- Sample zone. -->
            <Grid Row="2" Margin="16" MaxWidth="600" MaxHeight="800">

                <!-- Sample grid. -->
                <apexControls:ApexGrid Grid.Row="1" Grid.Column="2" Rows="Auto,*">

                    <!-- View selector. -->
                    <apexControls:SelectableItemsControl 
                x:Name="selectableItemsControl_Pages"
                Grid.Row="0" ItemsSource="{Binding PageViewModels}" SelectedItem="{Binding SelectedPageViewModel}">
                        <apexControls:SelectableItemsControl.ItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Horizontal" />
                            </ItemsPanelTemplate>
                        </apexControls:SelectableItemsControl.ItemsPanel>
                        <apexControls:SelectableItemsControl.ItemTemplate>
                            <DataTemplate>
                                <TextBlock 
                            Margin="10,2,10,2"
                            Text="{Binding Title}"
                            Style="{StaticResource MenuItemStyle}"
                            apexCommands:ExtendedCommands.LeftClickCommand="{Binding ElementName=selectableItemsControl_Pages, Path=SelectItemCommand}"
                            apexCommands:ExtendedCommands.LeftClickCommandParameter="{Binding}"
                            />
                            </DataTemplate>
                        </apexControls:SelectableItemsControl.ItemTemplate>
                    </apexControls:SelectableItemsControl>

                    <!-- View broker. -->
                    <apexControls:ViewBroker Grid.Row="1" ViewModel="{Binding SelectedPageViewModel}">
                        <TextBlock>This text is only shown if we cannot find a view for the viewmodel or the viewmodel is null.</TextBlock>
                    </apexControls:ViewBroker>

                </apexControls:ApexGrid>
            </Grid>
        </apexControls:PaddedGrid>
    </Grid>
</UserControl>